if ( typeof console == "undefined" ) {
	console = { log: function (){} }
}

Ext.onReady( function(  ) {

	init(  );

})

function init(  ){
	els = Ext.select( ".feedTitle", false );
	//console.log( els );
	if (els) {
		els.on( "click", feedClick );
	}
	
	feedContent = Ext.get( "feedContent" );
	if (feedContent) {
		feedContent.setHeight(window.innerHeight - 120 -20);
	}

	feedList = Ext.get("feedList");
	if (feedList) {
		feedList.setHeight(window.innerHeight - 120 -20);
	}

	window.onresize = function() {
		if (feedContent) feedContent.setHeight(window.innerHeight - 120 -20);
		if (feedList) feedList.setHeight(window.innerHeight - 120 -20);
	};

	// start
	opml = Ext.get( "opml" );
	if (opml) {
		opml.on( "change", function( e ) {
			this.dom.form.submit()
		})
	}

}

function feedClick( e  ) {
	var id = e.target.id;

	this.toggleFeed = this.toggleFeed || {};

	this.toggleFeed[id] = !this.toggleFeed[id];

	if ( !this.toggleFeed[id] ) {

		titleList = Ext.get( "titleList" + id );
		titleList.dom.innerHTML = "";

		return;	
	}

	Ext.Ajax.request( {
		url: "/showfeed",
		success: function (r,o) { 
			feedSuccess( r,o,id );
		},
		failure: feedFailure,
		params: {id:id} 
	} );
}

function feedSuccess (response, opts, id)
{
	content = Ext.decode( response.responseText )
	console.log( content, opts )	
	
	var rateStr = "<div style=\"display:inline;\">" +
				'<input type="radio" name="rate{id}" value="1" title="Very poor"> \
				<input type="radio" name="rate{id}" value="2" title="Not that bad"> \
				<input type="radio" name="rate{id}" value="3" title="Average"> \
				<input type="radio" name="rate{id}" value="4" title="Good"> \
				<input type="radio" name="rate{id}" value="5" title="Perfect"> \
' +		"</div>";


	var t = new Ext.Template( 
		"<div style=\"padding-bottom:10px;\" id=\"rate{id}\" >",
		"<div ><a href=\"{url}\" >{title}</a> <font size=\"1\"> {date}</font> " + rateStr + "</div>",
		"<div style=\"font-size:10pt;\">{content}</div>",
		"</div>"
	);

	var tl = new Ext.Template(  
		"<div id=\"feedRow{id}\">{title} {days} </div>",
		""
	);
	titleList = Ext.get( "titleList" + id );
	titleList.dom.innerHTML = "";
	for ( var k in content ){
		if ( isNaN( k ) ) continue;

		tl.append( titleList, {
			title:content[k].title,	
			date: content[k].date,
			days: content[k].days
		});
	}

	feedContent.dom.innerHTML = ""
	for ( var k in content ) {

		if ( isNaN( k ) ) continue;

		t.append( feedContent, {
			title   : content[k].title,
			date    : content[k].date,
			content : content[k].content,
			id      : content[k].id,
			url     : content[k].url
		});

		options = {}
		if ( content[k].rate ) {
			options.defaultSelected = content[k].rate - 1; // ! value - 1
		}

		var rate = new Ext.ux.Rating("rate"+content[k].id, options);

		var rid = content[k].id;

		rate.on( "change", function(rid) {

			return function(e) {
				Ext.Ajax.request({
					url:"/rate",
					success: function() {
					},
					failure: function() {
						alert( "unable to rate" );
					},
					params:{id:rid, value: e.value}
				});
			}

		}(rid) );

	}
}

function feedFailure (response, opts)
{
	console.log( response, opts )	
}
	

